<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="/WEB-INF/template.xhtml">

    <ui:define name="content">
        <script type="text/javascript">
            function validateModal() {
                if (document.getElementById('formCrear:maximumSeverity').value == 'true')
                    PF('dlg').show();
            }

            jQuery(function($) {
                $("[id='formCrear:fecNacimiento_input']").mask("99/99/9999");
            });

        </script>
        <h:form id="formCrear">
            <h:panelGrid columns="3" style="width: 100%">
                <p:outputLabel for="idTipoDocumento" value="#{msg.tipoIdentificacion}"/>
                <h:outputLabel for="numDocumento" value="#{msg.numeroIdentificacion}"  />
                <h:outputLabel for="desPrinombre" value="#{msg.primerNombre}"  />

                <p:selectOneMenu id="idTipoDocumento"
                                 value="#{administrarHistoriasClinicasAction.personaCrear.tTipDocumento}"
                                 converter="conversorEntidad">
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
                    <f:selectItems
                        value="#{administrarHistoriasClinicasAction.listaTipoDocumentos}"
                        var="tipoDocumento" itemLabel="#{tipoDocumento.desTipDocumento}"
                        itemValue="#{tipoDocumento}" />
                </p:selectOneMenu>
                <p:inputText id="numDocumento" required="true"
                             requiredMessage="Campo requerido: #{msg.numeroIdentificacion}"
                             value="#{administrarHistoriasClinicasAction.personaCrear.numDocumento}"
                             title="NumDocumento" />

                <p:inputText id="desPrinombre"
                             value="#{administrarHistoriasClinicasAction.personaCrear.desPrinombre}"
                             title="DesPrinombre" />

                <h:outputLabel for="desSegnombre" value="#{msg.segundoNombre}"  />
                <h:outputLabel for="desPriapellido" value="#{msg.primerApellido}"  />
                <h:outputLabel for="desSegapellido" value="#{msg.segundoApellido}"  />

                <p:inputText id="desSegnombre"
                             value="#{administrarHistoriasClinicasAction.personaCrear.desSegnombre}"
                             title="DesSegnombre" />             

                <p:inputText id="desPriapellido"
                             value="#{administrarHistoriasClinicasAction.personaCrear.desPriapellido}"
                             title="DesPriapellido" />

                <p:inputText id="desSegapellido"
                             value="#{administrarHistoriasClinicasAction.personaCrear.desSegapellido}"
                             title="DesSegapellido" />

                <h:outputLabel for="fecNacimiento" value="#{msg.fechaNacimiento}"  />
                <h:outputLabel for="edad" value="#{msg.edad}"  />
                <h:outputLabel for="idGenero" value="#{msg.genero}"  />

                <p:calendar id="fecNacimiento"  converterMessage="#{msg.formatoFechaInvalido}" navigator="true"  
                            value="#{administrarHistoriasClinicasAction.personaCrear.fecNacimiento}"
                            yearRange="c-50:c+0" pattern="dd/MM/yyyy">

                    <p:ajax event="dateSelect" update="edad"  listener="#{administrarHistoriasClinicasAction.calcularEdad()}"/>
                    <p:ajax event="change" update="edad"  listener="#{administrarHistoriasClinicasAction.calcularEdad()}"/>
                </p:calendar>

                <p:inputText id="edad" disabled="true"
                             value="#{administrarHistoriasClinicasAction.personaCrear.edad}"  />

                <p:selectOneMenu id="idGenero"
                                 value="#{administrarHistoriasClinicasAction.personaCrear.tGenero}"
                                 converter="conversorEntidad">
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
                    <f:selectItems
                        value="#{administrarHistoriasClinicasAction.listaGeneros}"
                        var="genero" itemLabel="#{genero.desGenero}"
                        itemValue="#{genero}" />
                </p:selectOneMenu>

                <h:outputLabel for="idCivil" value="#{msg.estadoCivil}"  />
                <h:outputLabel for="idSalud" value="#{msg.eps}"  />
                <h:outputLabel for="email" value="#{msg.email}"  />

                <p:selectOneMenu id="idCivil"
                                 value="#{administrarHistoriasClinicasAction.personaCrear.tEstadoCivil}"
                                 converter="conversorEntidad">
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
                    <f:selectItems
                        value="#{administrarHistoriasClinicasAction.listaEstadoCivil}"
                        var="tEstadoCivil" itemLabel="#{tEstadoCivil.desEstadoCivil}"
                        itemValue="#{tEstadoCivil}" />
                </p:selectOneMenu>

                <p:selectOneMenu id="idSalud"
                                 value="#{administrarHistoriasClinicasAction.personaCrear.tEmpresaSalud}"
                                 converter="conversorEntidad">
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
                    <f:selectItems
                        value="#{administrarHistoriasClinicasAction.listaEPS}"
                        var="tEmpresaSalud" itemLabel="#{tEmpresaSalud.desNomempresa}"
                        itemValue="#{tEmpresaSalud}" />
                </p:selectOneMenu>

                <p:inputText id="email"
                             value="#{administrarHistoriasClinicasAction.personaCrear.email}" />

                <h:outputLabel for="departamento" value="#{msg.departamento}"  />
                <h:outputLabel for="ciudad" value="#{msg.ciudad}"  />
                <h:outputLabel for="numTelfijo" value="#{msg.telefonoFijo}"  />

                <p:selectOneMenu id="departamento" converter="conversorEntidad"
                                 value="#{administrarHistoriasClinicasAction.departamentoMostrar}" >
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
                    <f:selectItems value="#{administrarHistoriasClinicasAction.listaDepartamentos}"
                                   var="var" itemLabel="#{var.nombre}" itemValue="#{var}" />

                    <p:ajax event="change" update="ciudad"
                            listener="#{administrarHistoriasClinicasAction.cambiarListaCiudades()}" />
                </p:selectOneMenu>

                <p:selectOneMenu id="ciudad" 
                                 value="#{administrarHistoriasClinicasAction.personaCrear.tCiudad}"  converter="conversorEntidad">
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
                    <f:selectItems
                        value="#{administrarHistoriasClinicasAction.listaCiudadesMostrar}" var="var"
                        itemLabel="#{var.nombre}" itemValue="#{var}" />
                </p:selectOneMenu>

                <p:inputText id="numTelfijo"
                             value="#{administrarHistoriasClinicasAction.personaCrear.numTelfijo}"
                             title="#{msg.telefonoFijo}" />

                <h:outputLabel for="numTelcelular" value="#{msg.telefonoCelular}"  />
                <h:outputLabel for="responsable" value="#{msg.responsable}"  />
                <h:outputLabel for="acompanante" value="#{msg.acompanante}"  />

                <p:inputText id="numTelcelular"
                             value="#{administrarHistoriasClinicasAction.personaCrear.numTelcelular}"
                             title="#{msg.telefonoCelular}" />

                <p:inputText id="responsable" disabled="#{administrarHistoriasClinicasAction.personaCrear.edadMostrar > 18 or administrarHistoriasClinicasAction.personaCrear.edadMostrar == null}"
                             value="#{administrarHistoriasClinicasAction.personaCrear.desResponsable}"/>

                <p:inputText id="acompanante" disabled="#{administrarHistoriasClinicasAction.personaCrear.edadMostrar > 18 or administrarHistoriasClinicasAction.personaCrear.edadMostrar == null}"
                             value="#{administrarHistoriasClinicasAction.personaCrear.desAcompanante}" />

                <h:outputLabel for="parentescoList" value="#{msg.parentesco}"  />
                <h:outputLabel for="idEconomica" value="#{msg.ocupacion}"  />
                <h:outputLabel for="" value="" />

                <p:selectOneMenu value="#{administrarHistoriasClinicasAction.personaCrear.TParentesco}" 
                                 id="parentescoList" converter="conversorEntidad" 
                                 disabled="#{administrarHistoriasClinicasAction.personaCrear.edadMostrar > 18 or administrarHistoriasClinicasAction.personaCrear.edadMostrar == null}"> 
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" /> 
                    <f:selectItems value="#{administrarHistoriasClinicasAction.listaParentescos}"  
                                   var="parentesco" itemLabel="#{parentesco.desParentesco}" itemValue="#{parentesco}" />  
                </p:selectOneMenu>

                <p:selectOneMenu id="idEconomica"
                                 value="#{administrarHistoriasClinicasAction.personaCrear.tActEconomica}"
                                 converter="conversorEntidad">
                    <f:selectItem itemLabel="#{msg.seleccione}" itemValue="" />
                    <f:selectItems
                        value="#{administrarHistoriasClinicasAction.listaOcupacion}"
                        var="tActEconomica" itemLabel="#{tActEconomica.desActEconomica}"
                        itemValue="#{tActEconomica}" />
                </p:selectOneMenu>
            </h:panelGrid>

            <h:inputHidden id="maximumSeverity" value="#{administrarHistoriasClinicasAction.mostrarPanel}"/>
            
            <h:panelGrid columns="1" style="width: 100%">
                <p:commandButton value="#{msg.crear}" style="text-align: right;" actionListener="#{administrarHistoriasClinicasAction.crear}" oncomplete="validateModal()" update="formCrear" />                
            </h:panelGrid>
        </h:form>

        <p:dialog header="#{msg.informacion}" widgetVar="dlg" resizable="false" closable="false" >
            <h:form id="form">

                <h:panelGrid columns="2" style="margin-bottom:10px">
                    <h:outputLabel value="operacionExitosa" />
                </h:panelGrid>

                <p:commandButton id="submitButton" value="#{msg.aceptar}" action="#{administrarHistoriasClinicasAction.resolverOperacion}" oncomplete="PF('dlg').hide();" />

            </h:form>
        </p:dialog>

    </ui:define>

</ui:composition>